<template>
  <view>
    <DList :listData="newsList" isScrolltolowerAutoLoad :requestFn="getNewsByUser" :size="queryParams.size"
      :currentPage.sync="queryParams.currentPage" :total="total">
      <template v-slot="{row}">
        <view class="album">
          <view class="album__avatar">
            <u-avatar :size="32" src="https://cdn.uviewui.com/uview/album/10.jpg"></u-avatar>
          </view>
          <view class="album__content">
            <u--text :text="row.storeName" type="primary" bold size="17"></u--text>
            <u--text margin="0 0 8px 0" :text="row.content"></u--text>
            <u-album :urls="row.urls"></u-album>
          </view>
        </view>
        <u-divider :dot="true"></u-divider>
      </template>
    </DList>
  </view>
</template>

<script>
  import {
    getNewsByUser
  } from '@/api/news/index.js';
  export default {
    data() {
      return {
        queryParams: {
          size: 15,
          currentPage: 1
        },
        total: 0,
        // 动态列表
        newsList: [],
      };
    },
    onTabItemTap() {
      this.init()
    },
    methods: {
      init() {
        this.getNewsByUser({
          size: this.queryParams.size,
          page: this.queryParams.currentPage
        })
      },
      async getNewsByUser({
        size,
        page
      }) {
        const res = await getNewsByUser({
          size,
          page
        })
        this.newsList.push(...res.data.rows)
        this.total = res.data.total
      }
    },
  };
</script>

<style lang="scss" scoped>
  .album {
    padding: 0 10px;
    @include flex;
    align-items: flex-start;

    &__avatar {
      padding: 5px;
    }

    &__content {
      margin-left: 10px;
      flex: 1;
    }
  }
</style>